<!DOCTYPE html>
<html xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" layout:decorator="templates/layout"
      xmlns:th="http://www.thymeleaf.org">
<div layout:fragment="content">
    <style>
        .divReturn {
            float: right
        }

        .divHeadline {
            float: left
        }

        .demo-section label {
            display: block;
            margin: 15px 0 5px 0;
        }

        .demo-section {
            display: inline-block;
            vertical-align: top;
            text-align: left;
            margin: 0 2em;
        }

        input[type="number"] {
            width: 100%;
            text-align: right;
        }

        thead > tr > th {
            text-align: center;
        }

        #tb > tr > td:nth-child(2) {
            text-align: right;
        }

        #tb > tr > td:nth-child(1) {
            text-align: center;
        }

    </style>

    <script type="text/javascript">
        //行号
        var rowCount = 1;
        //鼠标事件
        var mouseEvent;
        //行政区划名字
        var regionName = "";
        //行政区划代码
        var regionCode = "";
        //已选中的年份
        var checked_Nodes;
        //画面选择的年份
        var optionalYear;

        jQuery(function ($) {
            /**
             * 初始化错误提示框
             * */
            $(function () {
                $("#errorMessageDialog").kendoWindow({
                    visible: false,
                    modal: true,
                    draggable: false
                });
            });

            /**
             * 准备行政区划数据
             */
            $(function () {
                //子节点
                var regionDatas = {
                    //type: "json",
                    schema: {
                        model: {
                            id: "code",
                            hasChildren: "subcode"
                        }
                    },
                    transport: {
                        read: {
                            url: function (options) {
                                return kendo.format("/getRegionByParCode?parcode={0}", options.code);
                            }
                        }
                    }
                };
                //根节点
                var topRegionLevel = new kendo.data.HierarchicalDataSource({
                    //type: "json",
                    transport: {
                        read: {
                            url: "/getRegionInitData"
                        }
                    },
                    schema: {
                        model: {
                            hasChildren: "subcode",
                            id: "code",
                            children: regionDatas
                        }
                    }
                });


                $("#regionTreeView").kendoTreeView({
                    dataSource: topRegionLevel,
                    dataTextField: "name",
                    template: "#= item.name#<input type='hidden' class='data-id' value='#= item.code #' />",
                    select: onRegionTreeViewSelect
                });

                function onRegionTreeViewSelect(e) {
                    regionName = this.text(e.node);
                    regionCode = $(e.node).find(".data-id").val();
                };
            });

            /**
             * 准备年份数据
             */
            $(function () {
                $("#dialogYear").kendoDialog({
                    visible: false
                });
                $("#treeViewYear").kendoTreeView({
                    checkboxes: {
                        checkChildren: true
                    },
                    check: onCheck,
                    dataSource: [
                        {id: 1980, text: "1980"},
                        {id: 1981, text: "1981"},
                        {id: 1982, text: "1982"},
                        {id: 1983, text: "1983"},
                        {id: 1984, text: "1984"},
                        {id: 1985, text: "1985"},
                        {id: 1986, text: "1986"},
                        {id: 1987, text: "1987"},
                        {id: 1988, text: "1988"},
                        {id: 1989, text: "1989"},
                        {id: 1990, text: "1990"},
                        {id: 1991, text: "1991"},
                        {id: 1992, text: "1992"},
                        {id: 1993, text: "1993"},
                        {id: 1994, text: "1994"},
                        {id: 1995, text: "1995"},
                        {id: 1996, text: "1996"},
                        {id: 1997, text: "1997"},
                        {id: 1998, text: "1998"},
                        {id: 1999, text: "1999"},
                        {id: 2000, text: "2000"},
                        {id: 2001, text: "2001"},
                        {id: 2002, text: "2002"},
                        {id: 2003, text: "2003"},
                        {id: 2004, text: "2004"},
                        {id: 2005, text: "2005"},
                        {id: 2006, text: "2006"},
                        {id: 2007, text: "2007"},
                        {id: 2008, text: "2008"},
                        {id: 2009, text: "2009"},
                        {id: 2010, text: "2010"},
                        {id: 2011, text: "2011"},
                        {id: 2012, text: "2012"},
                        {id: 2013, text: "2013"},
                        {id: 2014, text: "2014"},
                        {id: 2015, text: "2015"},
                        {id: 2016, text: "2016"},
                        {id: 2017, text: "2017"}
                    ]
                });

                // function that gathers IDs of checked nodes
                function checkedNodeIds(nodes, checkedNodes) {
                    for (var i = 0; i < nodes.length; i++) {
                        if (nodes[i].checked) {
                            checkedNodes.push(nodes[i].id);
                        }
                    }
                };

                // show checked node IDs on datasource change
                function onCheck() {
                    var treeViewYear = $("#treeViewYear").data("kendoTreeView"),
                        checkedNodes = [],
                        message;

                    checkedNodeIds(treeViewYear.dataSource.view(), checkedNodes);
                    checked_Nodes = checkedNodes;
                    //alert(checked_Nodes);

                };

            });

            /**
             * 当点击画面其它位置时，将自定义的鼠标右键菜单隐藏掉
             */
            $(function () {
                $("body").click(function (e) {
                    //alert("ddd");
                    $("#mouseMenu0").hide();
                    $("#mouseMenu1").hide();
                    $("#mouseMenu3").hide();
                });
            });

            /**
             * 替换鼠标右键菜单
             */
            $(function () {
                $("thead").bind("contextmenu", function (e) {
                    //区分当前右键点击的位置
                    //表头部分
                    mouseEvent = e;
                    var rowId = e.target.id;
                    if (rowId == "rowContent" || rowId == "operateRow" || rowId == "lineNumber") {
                        return false;
                    }
                    else {
                        var row_Index = e.target.parentElement.rowIndex;
                        if (row_Index == 0) {
                            //alert("右键被屏蔽");
                            var x = e.originalEvent.clientX;
                            var y = e.originalEvent.clientY;
                            $("#mouseMenu0").css("left", x);
                            $("#mouseMenu0").css("top", y);
                            $("#mouseMenu0").show();
                            $("#mouseMenu1").hide();
                            $("#mouseMenu3").hide();
                        }
                        else {
                            var x = e.originalEvent.clientX;
                            var y = e.originalEvent.clientY;
                            $("#mouseMenu1").css("left", x);
                            $("#mouseMenu1").css("top", y);
                            $("#mouseMenu1").show();
                            $("#mouseMenu0").hide();
                            $("#mouseMenu3").hide();
                        }
                    }
                    return false;
                });
                //表格部分
                $("#tb").bind("contextmenu", function (e) {
                    mouseEvent = e;
                    var tdIndex = e.target.cellIndex;
                    var a_tdIndex = e.target.parentElement.cellIndex;
                    if (tdIndex == 0 || tdIndex == 1 || tdIndex == 2 || a_tdIndex == 0) {
                        return false;
                    }
                    else {
                        var row_Len = $("#tb tr").length;
                        for (var i = 0; i < row_Len; i++) {
                            var x = e.originalEvent.clientX;
                            var y = e.originalEvent.clientY;
                            $("#mouseMenu3").css("left", x);
                            $("#mouseMenu3").css("top", y);
                            $("#mouseMenu3").show();
                            $("#mouseMenu0").hide();
                            $("#mouseMenu1").hide();
                        }
                    }
                    return false;
                })
            });

            /**
             * 添加一列
             */
            $(function () {
                $("#dialogTarget").kendoDialog({
                    visible: false
                });
                //弹出添加指标中的选择年份
                optionalYear = $("#optionalYear").kendoMultiSelect({
                    autoClose: false
                }).data("kendoMultiSelect");

//                $("#get").click(function () {
//                    alert(optionalYear.value());
//                });

                $("#treeview-left").kendoTreeView({
                    dataTextField: "name"
                });

                var td1 = new kendo.data.HierarchicalDataSource({
                    data: [
                        {text: "农林牧渔业总产值"},
                        {text: "卫生机构人员及卫生条件"},
                        {text: "卫生机构数"},
                        {text: "公共图书馆情况"},
                        {text: "小学教育基本情况"},
                        {text: "普通中学学校基本情况"},
                        {text: "农村居民家庭基本情况"},
                        {text: "城镇居民收支情况"},
                        {text: "社会消费品零售总额"},
                        {text: "建筑业主要指标"},
                        {text: "工业企业主要财务指标"},
                        {text: "工业企业产值情况"},
                        {text: "主要农产品产量"}
                    ]
                });

//                var td2 = new kendo.data.HierarchicalDataSource({
//                    data: [
//                        {text: "农林牧渔业总产值"}
//                    ]
//                });

                //弹出添加指标的备选指标
                $("#addTarget").kendoTreeView({
                    checkboxes: {
                        checkChildren: true
                    },
                    check: onCheckTarget,
                    dataSource: td1
                });

                // function that gathers IDs of checked nodes
                function checkedTargetNodeIds(nodes, checkedNodes) {
                    for (var i = 0; i < nodes.length; i++) {
                        if (nodes[i].checked) {
                            checkedNodes.push(nodes[i].text);
                        }
                    }
                };

                // show checked node IDs on datasource change
                function onCheckTarget() {
                    var treeViewYear = $("#addTarget").data("kendoTreeView"),
                        checkedNodes = [],
                        message;

                    checkedTargetNodeIds(treeViewYear.dataSource.view(), checkedNodes);
                    checked_Nodes = checkedNodes;
                    //alert(checked_Nodes);

                };

                var addNewColButton = $("#addNewColButton");
                addNewColButton.click(function () {

                    //弹出添加指标的已存在指标
                    var lenTheadTrTh = $("thead tr").eq(0).find("th").length;

                    class TargetData {
                        constructor(name) {
                            this.name = name;
                        }
                    };
                    //画面上已经存在的指标
                    var existingTargetList = [];
                    for (var i = 3; i < lenTheadTrTh; i++) {
                        var tmpTargetName = $("#thd tr").eq(0).find("th").eq(i).text();

                        var tmpTargetData = new TargetData(tmpTargetName);

                        existingTargetList[i - 3] = tmpTargetData;
                    }
                    var inlineDefault = new kendo.data.HierarchicalDataSource({
                        data: existingTargetList
                    });
                    $("#treeview-left").data("kendoTreeView").setDataSource(inlineDefault);

                    //弹出添加指标的行政区划
                    var lengthTr = $("#tb tr").length;

                    class RegionData {
                        constructor(code, name) {
                            this.code = code;
                            this.name = name;
                        }
                    };

                    //画面上已经存在的行政区划
                    var existingRegionList = [];
                    for (var i = 0; i < lengthTr; i++) {
                        var tmpRegionName = $("#tb tr").eq(i).find("td").eq(2).text();
                        var tmpRegionCode = $("#tb tr").eq(i).find("td").eq(2).find("input").val();
                        var tmpRegionData = new RegionData(tmpRegionCode, tmpRegionName);

                        existingRegionList[i] = tmpRegionData;
                    }

                    $("#administrativeDivision").kendoDropDownList({
                        dataTextField: "name",
                        dataValueField: "value",
                        dataSource: existingRegionList
                    });

//                    $("#get").bind("click",function(){
//                        $("#addTarget").data("kendoTreeView").setDataSource(td2);
//                    });
//
//                    $("#get1").bind("click",function(){
//                        $("#addTarget").data("kendoTreeView").setDataSource(td1);
//                    });


                    //弹出添加指标的要查询的备选指标
                    var data = [
                        "农林牧渔业总产值",
                        "卫生机构人员及卫生条件",
                        "卫生机构数",
                        "公共图书馆情况",
                        "小学教育基本情况",
                        "普通中学学校基本情况",
                        "农村居民家庭基本情况",
                        "社会消费品零售总额",
                        "建筑业主要指标",
                        "工业企业主要财务指标",
                        "工业企业产值情况",
                        "主要农产品产量"
                    ];


                    //create AutoComplete UI component
                    $("#inquireTarget").kendoAutoComplete({
                        dataSource: data,
                        separator: ", "
                    });


                    //当点击添加行按钮时，弹出模式对话框
                    var dialogTarget = $("#dialogTarget");
                    dialogTarget.kendoDialog({
                        animation: {
                            close: {
                                effects: "fade:out"
                            },
                            open: {
                                effects: "fade:in"
                            }
                        },
                        actions: [{
                            text: "[[#{project.createOrEdit.button.ok}]]",
                            action: function (e) {
                                if (optionalYear.value().length == 0 || checked_Nodes == null || checked_Nodes.length == 0) {
                                    var errorMessage = "[[#{project.messages.error.examineOption}]]";
                                    showErrorMessage(errorMessage);
                                    return false;
                                }
                                else {
                                    var lenYear_addTarget = optionalYear.value().length;
                                    var len_checked_Nodes = checked_Nodes.length;
                                    var len_Tr = $("#tb tr").length;
                                    for (var k = 0; k < len_checked_Nodes; k++) {
                                        if ($("thead tr th:contains(" + checked_Nodes[k] + ")").length == 0) {
                                            $("#thd tr").eq(0).append("<th colspan='" + lenYear_addTarget + "'>" + checked_Nodes[k] + "</th>");
                                            for (var i = 0; i < lenYear_addTarget; i++) {
                                                $("#thd tr").eq(1).append("<th>" + optionalYear.value()[i] + "</th>");
                                                for (var j = 0; j < len_Tr; j++) {
                                                    var regionName_Now = $("#tb tr").eq(j).find("td").eq(2).text();//当前行政区划名称
                                                    var regionCode_Now = $("#tb tr").eq(j).find("td").eq(2).find("input").val();//当前行政区划代码
                                                    $("#tb tr").eq(j).append("<td><input id='" + checked_Nodes[k] + "_" + optionalYear.value()[i] + "_" + regionName_Now + "_" + regionCode_Now + "' type='number' class='form-control input-sm'/></td>");
                                                }
                                            }
                                        }
                                    }
                                    var buttonCol = $("#addNewColButton");
                                    if ($("#tb tr").length != 0 && $("#thd tr").eq(0).find("th").length == 3) {
                                        buttonCol.removeAttr("disabled");
                                    }
                                    else {
                                        buttonCol.attr("disabled", "disabled");
                                    }
                                }
                                return true;
                            },
                            primary: true
                        }, {
                            text: "[[#{project.createOrEdit.button.cancel}]]"
                        }],
                        width: "800px",
                        height: "470px",
                        title: "[[#{project.createOrEdit.text.createNewColumn}]]",
                        modal: "true"
                    });
                    dialogTarget.data("kendoDialog").open();
                    $("#dialogTarget").show();
                });

            });
            /**
             * 添加一行
             */
            $(function () {
                var addNewRowButton = $("#addNewRowButton");
                addNewRowButton.click(function () {
                    //当点击添加行按钮时，弹出模式对话框
                    var regionRowDialog = $("#regionRowDialog");
                    regionRowDialog.kendoDialog({
                        animation: {
                            close: {
                                effects: "fade:out"
                            },
                            open: {
                                effects: "fade:in"
                            }
                        },
                        actions: [{
                            text: "[[#{project.createOrEdit.button.ok}]]",
                            action: function (e) {
                                //添加一行
                                //tbody里的tr里的td含有行政区的长度为零时
                                if ($("tbody tr td:contains(" + regionName + ")").length == 0) {
                                    var tdnode = $("thead tr").eq(1).children("th").length;//年份的长度
                                    if (tdnode > 0) {
                                        $("#tb").append("<tr><td><a href='#' onclick='removeRow(this)'>删除</a></td><td>" + rowCount++ + "</td><td>" + regionName + "<input type='hidden' class='data-id' value='" + regionCode + "' /></td></tr>");
                                        for (var i = 0; i < tdnode; i++) {
                                            var len_FormerlyTd = $("#tb tr").eq(rowCount - 2).find("td").length;//之前该行td的长度
                                            var len_NextTdInput = len_FormerlyTd - 2;//即将插入的input的长度
                                            var len_Target = $("#thd tr").eq(0).find("th").length;//指标所在的那行长度
                                            for (var k = 3; k < len_Target; k++) {
                                                var colVal = $("#thd tr").eq(0).find("th").eq(k).attr("colspan");//取当前指标colspan的值
                                                len_NextTdInput = len_NextTdInput - colVal;//即将添加的input长度减当前指标colspan的值的差
                                                if (len_NextTdInput <= 0) {
                                                    break;
                                                }
                                            }
                                            var targetName = $("#thd tr").eq(0).find("th").eq(k).text();//指标名称
                                            var yearText = $("#thd tr").eq(1).find("th").eq(len_FormerlyTd - 3).text();//年份
                                            $("#tb tr").eq(rowCount - 2).find("td").eq(len_FormerlyTd - 1).after("<td><input id='" + targetName + "_" + yearText + "_" + regionName + "_" + regionCode + "' type='number' class='form-control input-sm'/></td>");
                                        }
                                    }
                                    else {
                                        $("#tb").append("<tr><td><a href='#' onclick='removeRow(this)'>删除</a></td><td>" + rowCount++ + "</td><td>" + regionName + "<input type='hidden' class='data-id' value='" + regionCode + "' /></td></tr>");
                                    }
                                    var buttonCol = $("#addNewColButton");
                                    if ($("#tb tr").length != 0 && $("#thd tr").eq(0).find("th").length == 3) {
                                        buttonCol.removeAttr("disabled");
                                    }
                                    else {
                                        buttonCol.attr("disabled", "disabled");
                                    }
                                }
                                else {
                                    var errorMessage = "[[#{project.messages.error.existRegion}]]";
                                    showErrorMessage(errorMessage);
                                    return false;
                                }
                                return true;
                            },
                            primary: true
                        }, {
                            text: "[[#{project.createOrEdit.button.cancel}]]"
                        }],
                        width: "415px",
                        height: "350px",
                        title: "[[#{project.createOrEdit.text.selectRegion}]]",
                        modal: "true"
                    });
                    regionRowDialog.data("kendoDialog").open();
                    $("#regionRowDialog").show();
                });
            });
            /**
             * 准备更新数据源控件
             */
            $(function () {
                $("#dialogUpdateData").kendoDialog({
                    visible: false
                });
                var td1 = new kendo.data.HierarchicalDataSource({
                    data: [
                        {name: "农林牧渔业总产值"},
                        {name: "卫生机构人员及卫生条件"},
                        {name: "卫生机构数"},
                        {name: "公共图书馆情况"},
                        {name: "小学教育基本情况"},
                        {name: "普通中学学校基本情况"},
                        {name: "农村居民家庭基本情况"},
                        {name: "城镇居民收支情况"},
                        {name: "社会消费品零售总额"},
                        {name: "建筑业主要指标"},
                        {name: "工业企业主要财务指标"},
                        {name: "工业企业产值情况"},
                        {name: "主要农产品产量"}
                    ]
                });
                $("#addTarget_Update").kendoTreeView({
                    dataSource: td1,
                    dataTextField: "name",
                    //template: "#= item.name#<input type='hidden' class='data_Update-id' value='#= item.code #' />",
                    select: onRegionTreeViewSelect
                });

                function onRegionTreeViewSelect(e) {
                    regionName = this.text(e.node);
                    regionCode = $(e.node).find(".data_Update-id").val();
                };
            });

        });


        /************************************************************************************************
         * 独立方法块
         *************************************************************************************************/

        /**
         * 更新数据源
         */
        function updateData() {
            //取当前统计年份并赋给相应文本框
            var theq = mouseEvent.target.parentElement.cellIndex - 3;//取当前年份脚标
            var yearNow = $("#thd tr").eq(1).find("th").eq(theq).text();//取年份
            $("#yearText").val(yearNow);
            //取当前行政区划并赋给相应文本框
            var treq = mouseEvent.target.parentElement.parentElement.rowIndex - 2;//取当前行的脚标
            var areaNow = $("#tb tr").eq(treq).find("td").eq(2).text();//取当前行政区划
            $("#areaText").val(areaNow);
            //取当前指标并赋给相应文本框
            var lenTd = mouseEvent.target.parentElement.cellIndex - 2//去掉前三列后，当前长度
            var targetIndex = 3;
            for (var i = 0; ; i++) {
                var targetColVal = $("#thd tr").eq(0).find("th").eq(targetIndex).attr("colspan");//依次取每个指标的colspan的值
                lenTd = lenTd - parseInt(targetColVal);
                if (lenTd <= 0) {
                    break;
                }
                targetIndex++;
            }

            var targetNow = $("#thd tr").eq(0).find("th").eq(targetIndex).text();//取指标
            $("#targetText").val(targetNow);
            //弹出相应的更新数据源对话框
            var dialogUpdateData = $("#dialogUpdateData");
            dialogUpdateData.kendoDialog({
                animation: {
                    close: {
                        effects: "fade:out"
                    },
                    open: {
                        effects: "fade:in"
                    }
                },
                actions: [{
                    text: "[[#{project.createOrEdit.button.ok}]]",
                    action: function (e) {
                        if ($("#thd tr th:contains(" + regionName + ")").length == 0) {
                            $("#thd tr").eq(0).find("th").eq(targetIndex).text(regionName);
                        }
                        else {
                            var errorMessage = "[[#{project.messages.error.existRegion}]]";
                            showErrorMessage(errorMessage);
                            return false;
                        }
                        return true;
                    },
                    primary: true
                }, {
                    text: "[[#{project.createOrEdit.button.cancel}]]"
                }],
                width: "800px",
                height: "470px",
                title: "[[#{project.createOrEdit.text.updateData}]]",
                modal: "true"
            });
            dialogUpdateData.data("kendoDialog").open();
            $("#dialogUpdateData").show();
        };

        /**
         * 往前添加一列指标
         */
        function addIndicatorBefore() {
            $("#addTarget input.k-checkbox").prop("checked", false);//再次打开弹出窗口后你，把历史选中的备选指标去掉

            //弹出添加指标的已存在指标
            var lenTheadTrTh = $("thead tr").eq(0).find("th").length;

            class TargetData {
                constructor(name) {
                    this.name = name;
                }
            };
            //画面上已经存在的指标
            var existingTargetList = [];
            for (var i = 3; i < lenTheadTrTh; i++) {
                var tmpTargetName = $("#thd tr").eq(0).find("th").eq(i).text();

                var tmpTargetData = new TargetData(tmpTargetName);

                existingTargetList[i - 3] = tmpTargetData;
            }
            var inlineDefault = new kendo.data.HierarchicalDataSource({
                data: existingTargetList
            });
            $("#treeview-left").data("kendoTreeView").setDataSource(inlineDefault);

            //弹出添加指标的行政区划
            //var allTbTrValue = $("tbody tr td:nth-child(3)").text();
            var lengthTr = $("#tb tr").length;

            class RegionData {
                constructor(code, name) {
                    this.code = code;
                    this.name = name;
                }
            };

            //画面上已经存在的行政区划
            var existingRegionList = [];
            for (var i = 0; i < lengthTr; i++) {
                var tmpRegionName = $("#tb tr").eq(i).find("td").eq(2).text();
                var tmpRegionCode = $("#tb tr").eq(i).find("td").eq(2).find("input").val();
                var tmpRegionData = new RegionData(tmpRegionCode, tmpRegionName);

                existingRegionList[i] = tmpRegionData;
            }

            $("#administrativeDivision").kendoDropDownList({
                dataTextField: "name",
                dataValueField: "value",
                dataSource: existingRegionList
            });

            //弹出添加指标的要查询的备选指标
            var data = [
                "农林牧渔业总产值",
                "卫生机构人员及卫生条件",
                "卫生机构数",
                "公共图书馆情况",
                "小学教育基本情况",
                "普通中学学校基本情况",
                "农村居民家庭基本情况",
                "社会消费品零售总额",
                "建筑业主要指标",
                "工业企业主要财务指标",
                "工业企业产值情况",
                "主要农产品产量"
            ];


            //create AutoComplete UI component
            $("#inquireTarget").kendoAutoComplete({
                dataSource: data,
                separator: ", "
            });

            //当点击添加行按钮时，弹出模式对话框
            var dialogTarget = $("#dialogTarget");
            dialogTarget.kendoDialog({
                animation: {
                    close: {
                        effects: "fade:out"
                    },
                    open: {
                        effects: "fade:in"
                    }
                },
                actions: [{
                    text: "[[#{project.createOrEdit.button.ok}]]",
                    action: function (e) {
                        if (optionalYear.value().length == 0 || checked_Nodes.length == 0) {
                            var errorMessage = "[[#{project.messages.error.examineOption}]]";
                            showErrorMessage(errorMessage);
                            return false;
                        }
                        else {
                            var theq = mouseEvent.target.cellIndex;
                            var colspanval = 0;
                            for (var i = 3; i < theq; i++) {
                                //在thead的第一行第三个脚标开始循环，i不超过要添加指标的脚标
                                var a = $("thead tr").eq(0).find("th").eq(i).attr("colspan");//取第一行每个th的colspan的值
                                colspanval = colspanval + parseInt(a);//求当前所有th的colspan值的总和
                            }
                            var lenYear_addTarget = optionalYear.value().length;
                            var len_checked_Nodes = checked_Nodes.length;
                            var len = $("#tb tr").length;//得到当前要增加的td的长度
                            for (var j = 0; j < len_checked_Nodes; j++) {
                                if ($("thead tr th:contains(" + checked_Nodes[j] + ")").length == 0) {
                                    $("#thd tr").eq(0).find("th").eq(theq).before("<th colspan='" + lenYear_addTarget + "'>" + checked_Nodes[j] + "</th>");
                                    for (var k = 0; k < lenYear_addTarget; k++) {
                                        $("thead tr").eq(1).find("th").eq(colspanval).before("<th>" + optionalYear.value()[k] + "</th>");
                                        for (var i = 0; i < len; i++) {
                                            var regionName_Now = $("#tb tr").eq(i).find("td").eq(2).text();//当前行政区划名称
                                            var regionCode_Now = $("#tb tr").eq(i).find("td").eq(2).find("input").val();//当前行政区划代码
                                            $("tbody tr").eq(i).find("td").eq(colspanval + 3).before("<td><input id='" + checked_Nodes[j] + "_" + optionalYear.value()[k] + "_" + regionName_Now + "_" + regionCode_Now + "' type='number' class='form-control input-sm'/></td>");//依次添加对应的tbody每行td
                                        }
                                    }
                                }
                                else {
                                    showErrorMessage("[[#{project.messages.error.existAlready}]]“" + checked_Nodes[j] + "”");
                                    return false;
                                }
                            }
                        }
                        return true;
                    },
                    primary: true
                }, {
                    text: "[[#{project.createOrEdit.button.cancel}]]"
                }],
                width: "800px",
                height: "470px",
                title: "[[#{project.createOrEdit.text.createNewColumn}]]",
                modal: "true"
            });
            dialogTarget.data("kendoDialog").open();
            $("#dialogTarget").show();
        };

        /**
         * 往后添加一列指标
         */
        function addIndicatorAfter() {
            $("#addTarget input.k-checkbox").prop("checked", false);//再次打开弹出窗口后你，把历史选中的备选指标去掉

            //弹出添加指标的已存在指标
            var lenTheadTrTh = $("thead tr").eq(0).find("th").length;

            class TargetData {
                constructor(name) {
                    this.name = name;
                }
            };
            //画面上已经存在的指标
            var existingTargetList = [];
            for (var i = 3; i < lenTheadTrTh; i++) {
                var tmpTargetName = $("#thd tr").eq(0).find("th").eq(i).text();

                var tmpTargetData = new TargetData(tmpTargetName);

                existingTargetList[i - 3] = tmpTargetData;
            }
            var inlineDefault = new kendo.data.HierarchicalDataSource({
                data: existingTargetList
            });
            $("#treeview-left").data("kendoTreeView").setDataSource(inlineDefault);

            //弹出添加指标的行政区划
            //var allTbTrValue = $("tbody tr td:nth-child(3)").text();
            var lengthTr = $("#tb tr").length;

            class RegionData {
                constructor(code, name) {
                    this.code = code;
                    this.name = name;
                }
            };

            //画面上已经存在的行政区划
            var existingRegionList = [];
            for (var i = 0; i < lengthTr; i++) {
                var tmpRegionName = $("#tb tr").eq(i).find("td").eq(2).text();
                var tmpRegionCode = $("#tb tr").eq(i).find("td").eq(2).find("input").val();
                var tmpRegionData = new RegionData(tmpRegionCode, tmpRegionName);

                existingRegionList[i] = tmpRegionData;
            }

            $("#administrativeDivision").kendoDropDownList({
                dataTextField: "name",
                dataValueField: "value",
                dataSource: existingRegionList
            });

            //弹出添加指标的要查询的备选指标
            var data = [
                "农林牧渔业总产值",
                "卫生机构人员及卫生条件",
                "卫生机构数",
                "公共图书馆情况",
                "小学教育基本情况",
                "普通中学学校基本情况",
                "农村居民家庭基本情况",
                "社会消费品零售总额",
                "建筑业主要指标",
                "工业企业主要财务指标",
                "工业企业产值情况",
                "主要农产品产量"
            ];


            //create AutoComplete UI component
            $("#inquireTarget").kendoAutoComplete({
                dataSource: data,
                separator: ", "
            });

            //当点击添加行按钮时，弹出模式对话框
            var dialogTarget = $("#dialogTarget");
            dialogTarget.kendoDialog({
                animation: {
                    close: {
                        effects: "fade:out"
                    },
                    open: {
                        effects: "fade:in"
                    }
                },
                actions: [{
                    text: "[[#{project.createOrEdit.button.ok}]]",
                    action: function (e) {
                        if (optionalYear.value().length == 0 || checked_Nodes.length == 0) {
                            var errorMessage = "[[#{project.messages.error.examineOption}]]";
                            showErrorMessage(errorMessage);
                            return false;
                        }
                        else {
                            var theq = mouseEvent.target.cellIndex;
                            var colspanval = 0;
                            for (var i = 3; i < theq; i++) {
                                //在thead的第一行第三个脚标开始循环，i不超过要添加指标的脚标
                                var a = $("thead tr").eq(0).find("th").eq(i).attr("colspan");//取第一行每个th的colspan的值
                                colspanval = colspanval + parseInt(a);//求当前所有th的colspan值的总和
                            }
                            var lenYear_addTarget = optionalYear.value().length;
                            var len_checked_Nodes = checked_Nodes.length;
                            var len = $("tbody tr").length;//得到当前要增加的td的长度
                            for (var j = 0; j < len_checked_Nodes; j++) {
                                if ($("thead tr th:contains(" + checked_Nodes[j] + ")").length == 0) {
                                    $("#thd tr").eq(0).find("th").eq(theq).after("<th colspan='" + lenYear_addTarget + "'>" + checked_Nodes[j] + "</th>");
                                    for (var k = 0; k < lenYear_addTarget; k++) {
                                        $("thead tr").eq(1).find("th").eq(colspanval).after("<th>" + optionalYear.value()[k] + "</th>");
                                        for (var i = 0; i < len; i++) {
                                            var regionName_Now = $("#tb tr").eq(i).find("td").eq(2).text();//当前行政区划名称
                                            var regionCode_Now = $("#tb tr").eq(i).find("td").eq(2).find("input").val();//当前行政区划代码
                                            $("tbody tr").eq(i).find("td").eq(colspanval + 3).after("<td><input id='" + checked_Nodes[j] + "_" + optionalYear.value()[k] + "_" + regionName_Now + "_" + regionCode_Now + "' type='number' class='form-control input-sm'/></td>");//依次添加对应的tbody每行td
                                        }
                                    }
                                }
                                else {
                                    showErrorMessage("[[#{project.messages.error.existAlready}]]“" + checked_Nodes[j] + "”");
                                    return false;
                                }
                            }
                        }
                        return true;
                    },
                    primary: true
                }, {
                    text: "[[#{project.createOrEdit.button.cancel}]]"
                }],
                width: "800px",
                height: "470px",
                title: "[[#{project.createOrEdit.text.createNewColumn}]]",
                modal: "true"
            });
            dialogTarget.data("kendoDialog").open();
            $("#dialogTarget").show();

        };

        /**
         * 删除一列指标
         */
        function removeIndicator() {
            var theq = mouseEvent.target.cellIndex;//取到当前的脚标
            //var residuetheq = theq - 2;
            var colspanval = 0;
            for (var i = 3; i < theq; i++) {
                //在thead的第一行第三个脚标开始循环，i不超过要删除指标的脚标
                var a = $("thead tr").eq(0).find("th").eq(i).attr("colspan");//取第一行每个th的colspan的值
                colspanval = colspanval + parseInt(a);//求当前所有th的colspan值的总和
            }
            var colspanval_theq = $("thead tr").eq(0).find("th").eq(theq).attr("colspan");//取当前要删除的指标colspan的值
            colspanval_theq = parseInt(colspanval_theq);//强制转换为int型
            for (var i = 0; i < colspanval_theq; i++) {
                $("thead tr").eq(1).find("th").eq(colspanval).remove();//找到对应th的并删除
                var str = "tbody tr td:nth-child(" + parseInt(colspanval + 4) + ")";
                console.log(str);
                $(str).remove();//删除tbody里的对应列
            }
            $("thead tr").eq(0).find("th").eq(theq).remove();//删除该指标
            var buttonCol = $("#addNewColButton");
            if ($("#tb tr").length != 0 && $("#thd tr").eq(0).find("th").length == 3) {
                buttonCol.removeAttr("disabled");
            }
            else {
                buttonCol.attr("disabled", "disabled");
            }
        };

        /**
         * 删除一列年份
         */
        function removeYear() {
            var theq_1 = mouseEvent.target.cellIndex;//脚标
            var theq_1_len = theq_1 + 1;//长度
            var a = 0;
            var i = 0;
            for (i = 3; ; i++) {
                a = $("thead tr").eq(0).find("th").eq(i).attr("colspan");//依次colspan的值
                theq_1_len = theq_1_len - parseInt(a);//剩余长度
                if (theq_1_len <= 0) {
                    break;//跳出
                }
            }
            var b = parseInt(a) - 1;//当前指标colspan的值减一
            if (b == 0) {
                $("thead tr").eq(0).find("th").eq(i).remove();//如果指标下只有一个年份，那么删除年份，指标也会被删除
                $("thead tr").eq(1).find("th").eq(theq_1).remove();
                var len = $("tbody tr").length;//得到当前要删除的年份长度
                for (var k = 0; k < len; k++) {
                    $("tbody tr").eq(k).find("td").eq(theq_1 + 3).remove();//依次删除年份对应的tbody每行td
                }
            }
            else {
                $("thead tr").eq(0).find("th").eq(i).attr("colspan", b);//付给当前的指标应有的colspan值
                $("thead tr").eq(1).find("th").eq(theq_1).remove();
                var len = $("tbody tr").length;//得到当前要删除的td长度
                for (var k = 0; k < len; k++) {
                    $("tbody tr").eq(k).find("td").eq(theq_1 + 3).remove();//依次删除年份对应的tbody每行td
                }
            }
            var buttonCol = $("#addNewColButton");
            if ($("#tb tr").length != 0 && $("#thd tr").eq(0).find("th").length == 3) {
                buttonCol.removeAttr("disabled");
            }
            else {
                buttonCol.attr("disabled", "disabled");
            }
        }

        /**
         * 往后添加一列年份
         */
        function addYearAfter() {
            $("#dialogYear").kendoDialog({

                actions: [{
                    text: "[[#{project.createOrEdit.button.ok}]]",
                    action: function (e) {
                        var theq = mouseEvent.target.cellIndex;//当前年份的脚标
                        var tdeq = mouseEvent.target.cellIndex + 3;//当前td的脚标
                        var k = 3;
                        var residuetheq = theq + 1;//当前年份的长度
                        var allNormColspanVal = 0;
                        for (var j = 0; ; k++) {
                            j = $("thead tr").eq(0).find("th").eq(k).attr("colspan");//脚标为k指标的colspan值
                            residuetheq = residuetheq - j;
                            allNormColspanVal = allNormColspanVal + parseInt(j);
                            if (residuetheq <= 0) {
                                break;
                            }
                        }
                        var anElement = $("thead tr").eq(0).find("th").eq(k);
                        var colval = anElement.attr("colspan");//得到被右键的年份所属的指标colspan值
                        //准备查出该指标已有的所有年份
                        var bygoneYear = [];//已经存在的年份
                        allNormColspanVal = allNormColspanVal - 1;
                        for (var g = 0; g < colval; g++) {
                            bygoneYear[g] = $("thead tr").eq(1).find("th").eq(allNormColspanVal).text();
                            allNormColspanVal--;
                        }
                        var executeCount = 0;
                        var numberYear = checked_Nodes.length;//得到选中年份的长度
                        //进入循环（依次添加新年份的循环）
                        for (var j = 0; j < numberYear; j++) {
                            //有相同年份结束，否则添加新年份
                            var bygoneYearLength = bygoneYear.length;
                            for (var t = 0; t < bygoneYearLength; t++) {
                                var judgeSign = 0;
                                if (bygoneYear[t] == checked_Nodes[j]) {
                                    judgeSign = 1;
                                    break;
                                }
                            }
                            if (judgeSign == 1) {

                            }
                            else {
                                //依次添加选中的年份
                                $("thead tr").eq(1).find("th").eq(theq).after("<th>" + checked_Nodes[j] + "</th>");
                                var len = $("tbody tr").length;
                                for (var i = 0; i < len; i++) {
                                    var regionName_Now = $("#tb tr").eq(i).find("td").eq(2).text();//当前行政区划名称
                                    var regionCode_Now = $("#tb tr").eq(i).find("td").eq(2).find("input").val();//当前行政区划代码
                                    $("tbody tr").eq(i).find("td").eq(tdeq).after("<td><input id='" + anElement.text() + "_" + checked_Nodes[j] + "_" + regionName_Now + "_" + regionCode_Now + "' type='number' class='form-control input-sm'/></td>");
                                }
                                executeCount++;
                            }
                        }

                        colval = parseInt(colval) + executeCount;//添加年份后，被右键的指标应该变成的colspan值
                        anElement.attr("colspan", colval);//覆盖以前的colspan值
                        return true;
                    },
                    primary: true
                }, {
                    text: "[[#{project.createOrEdit.button.cancel}]]"
                }],
                width: "415px",
                height: "350px",
                title: "[[#{project.createOrEdit.text.selectDecade}]]",
                modal: "true"
            });

            var dialogYear = $("#dialogYear").data("kendoDialog");
            dialogYear.open();
        };

        /**
         * 往前添加一行年份
         */
        function addYearBefore() {

            $("#dialogYear").kendoDialog({

                actions: [{
                    text: "[[#{project.createOrEdit.button.ok}]]",
                    action: function (e) {
                        var theq = mouseEvent.target.cellIndex;//当前年份的脚标
                        var tdeq = mouseEvent.target.cellIndex + 3;//当前td的脚标
                        var k = 3;
                        var residuetheq = theq + 1;
                        var allNormColspanVal = 0;//所有指标colspan值的总和
                        for (var j = 0; ; k++) {
                            j = $("thead tr").eq(0).find("th").eq(k).attr("colspan");
                            residuetheq = residuetheq - j;
                            allNormColspanVal = allNormColspanVal + parseInt(j);
                            if (residuetheq <= 0) {
                                break;
                            }
                        }
                        var anElement = $("thead tr").eq(0).find("th").eq(k);
                        var colval = anElement.attr("colspan");//得到被右键的年份所属的指标colspan值
                        //准备查出该指标已有的所有年份
                        var bygoneYear = [];//已经存在的年份
                        allNormColspanVal = allNormColspanVal - 1;
                        for (var g = 0; g < colval; g++) {
                            bygoneYear[g] = $("thead tr").eq(1).find("th").eq(allNormColspanVal).text();
                            allNormColspanVal--;
                        }
                        var executeCount = 0;
                        var numberYear = checked_Nodes.length;//得到选中年份的长度
                        //进入循环（依次添加新年份的循环）
                        for (var j = 0; j < numberYear; j++) {
                            //有相同年份结束，否则添加新年份
                            var bygoneYearLength = bygoneYear.length;
                            for (var t = 0; t < bygoneYearLength; t++) {
                                var judgeSign = 0;
                                if (bygoneYear[t] == checked_Nodes[j]) {
                                    judgeSign = 1;
                                    break;
                                }
                            }
                            if (judgeSign == 1) {

                            }
                            else {
                                //依次添加选中的年份
                                $("thead tr").eq(1).find("th").eq(theq).before("<th>" + checked_Nodes[j] + "</th>");
                                var len = $("tbody tr").length;
                                for (var i = 0; i < len; i++) {
                                    var regionName_Now = $("#tb tr").eq(i).find("td").eq(2).text();//当前行政区划名称
                                    var regionCode_Now = $("#tb tr").eq(i).find("td").eq(2).find("input").val();//当前行政区划代码
                                    $("tbody tr").eq(i).find("td").eq(tdeq).before("<td><input id='" + anElement.text() + "_" + checked_Nodes[j] + "_" + regionName_Now + "_" + regionCode_Now + "' type='number' class='form-control input-sm'/></td>");
                                }
                                executeCount++;
                            }

                        }
                        colval = parseInt(colval) + executeCount;//添加年份后，被右键的指标应该变成的colspan值
                        anElement.attr("colspan", colval);//覆盖以前的colspan值
                        return true;
                    },
                    primary: true
                }, {
                    text: "[[#{project.createOrEdit.button.cancel}]]"
                }],
                width: "415px",
                height: "350px",
                title: "[[#{project.createOrEdit.text.selectDecade}]]",
                modal: "true"
            });

            var dialogYear = $("#dialogYear").data("kendoDialog");
            dialogYear.open();


        }

        /**
         * 删除一行
         */
        function removeRow(e) {
            e.parentElement.parentElement.remove();
            rowCount--;
            var len = $("#tb tr").length;
            for (var i = 0; i < len; i++) {
                $("#tb tr").eq(i).children("td").eq(1).text(i + 1);
            }
            var buttonCol = $("#addNewColButton");
            if ($("#tb tr").length != 0 && $("#thd tr").eq(0).find("th").length == 3) {
                buttonCol.removeAttr("disabled");
            }
            else {
                buttonCol.attr("disabled", "disabled");
            }
        };

        /**
         * 弹出错误提示窗口
         * @param errorMessage 自定义错误信息
         */
        function showErrorMessage(errorMessage) {
            $("#errorMessageDialog").text(errorMessage);
            var errorMessageDialog = $("#errorMessageDialog").data("kendoWindow");
            errorMessageDialog.center();
            errorMessageDialog.open();
        }

        /**
         * 保存表格
         */
        function saveTableMessage() {
            $("#dialogSave").kendoDialog({

                actions: [{
                    text: "[[#{project.createOrEdit.button.ok}]]",
                    action: function (e) {


                        return true;
                    },
                    primary: true
                }, {
                    text: "[[#{project.createOrEdit.button.cancel}]]"
                }],
                width: "415px",
                height: "350px",
                title: "[[#{project.createOrEdit.text.saveTable}]]",
                modal: "true"
            });

            var dialogSave = $("#dialogSave").data("kendoDialog");
            dialogSave.open();
            $("#dialogSave").show();
        }
    </script>
    <script type="text/javascript" src="/scripts/project/save.js">
    </script>
    <div class="box box-info">
        <div class="box-header with-border">
            <h3 class="box-title" th:text="#{project.createOrEdit.text.createOrEdit }">Latest Orders</h3>

            <div class="box-tools pull-right">
                <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i>
                </button>
            </div>
        </div>
        <!-- /.box-header -->
        <div class="box-body">
            <div class="table-responsive">
                <div style="border-bottom:1px;">
                    <div style="padding-bottom: 10px; padding-left: 0px;">
                        <div class="container" style="width:100%;">
                            <div class="row">
                                <div class="col-md-7" style="text-align:left">
                                    <span style="display:inline;" th:text="#{project.createOrEdit.text.projectName}">项目名称</span>
                                    <input class="form-control input-sm" type="text" th:value="${project.name}"
                                           style="width:400px;font-size:14px;display:inline;">

                                </div>
                                <div class="col-md-4" style="text-align:right">
                                    <button id="addNewRowButton" class="btn btn-primary"
                                            th:text="#{project.createOrEdit.button.createNewRow}">添加行
                                    </button>
                                    <!--<a class="btn btn-app" id="addNewColButton">-->
                                    <!--<i class="fa fa-plus"></i>-->
                                    <!--<span th:text="#{project.createOrEdit.button.createNewColumn}"></span>-->
                                    <!--</a>-->
                                    <button id="addNewColButton" class="btn btn-primary" disabled="disabled"
                                            th:text="#{project.createOrEdit.button.createNewColumn}">添加列
                                    </button>
                                </div>
                                <div class="col-md-1" style="text-align:right">
                                    <input type="button" id="saveTable" class="btn btn-success"
                                           onclick="saveTableMessage()"
                                           th:value="#{project.createOrEdit.button.saveTable}">
                                    </input>
                                </div>
                            </div>
                        </div>
                        <!--<a class="btn btn-app" id="addNewRowButton">-->
                        <!--<i class="fa fa-plus"></i>-->
                        <!--<span th:text="#{project.createOrEdit.button.createNewRow}"></span>-->
                        <!--</a>-->


                    </div>
                </div>

                <table class="table table-bordered table-hover">
                    <thead id="thd">
                    <tr id="trHeader">
                        <th id="operateRow" rowspan="2" style="width: 80px;"
                            th:text="#{project.createOrEdit.text.option}">操作
                        </th>
                        <th id="lineNumber" rowspan="2" style="width: 100px;"
                            th:text="#{project.createOrEdit.text.lineNumber}">序号／行号
                        </th>
                        <th id="rowContent" rowspan="2" th:text="#{project.createOrEdit.text.regionName}">行政区划</th>
                    </tr>
                    <tr>
                    </tr>
                    </thead>
                    <tbody id="tb">
                    </tbody>
                </table>
            </div>
            <!-- /.table-responsive -->
        </div>
        <!-- /.box-body -->
    </div>


    <!--插入指标的菜单-->
    <div id="mouseMenu0" style="display: none; float: left; position: absolute;">
        <table class="table table-bordered table-hover" style=" background-color: ghostwhite;">
            <tr>
                <td>
                    <button type="button" class="btn btn-primary btn-sm" onclick="addIndicatorBefore()"
                            th:text="#{project.createOrEdit.button.createTargetLeft}">在左边插入指标
                    </button>
                </td>
            </tr>
            <tr>
                <td>
                    <button type="button" class="btn btn-primary btn-sm" onclick="addIndicatorAfter()"
                            th:text="#{project.createOrEdit.button.createTargetRight}">在右边插入指标
                    </button>
                </td>
            </tr>
            <tr>
                <td>
                    <button type="button" class="btn btn-primary btn-sm" onclick="removeIndicator()"
                            th:text="#{project.createOrEdit.button.deleteTarget}">删除此列指标
                    </button>
                </td>
            </tr>
        </table>
    </div>
    <!--插入年份的菜单-->
    <div id="mouseMenu1" style="display: none; float: left; position: absolute;">
        <table class="table table-bordered table-hover" style=" background-color: ghostwhite;">
            <tr>
                <td>
                    <button type="button" class="btn btn-primary btn-sm" onclick="addYearBefore()"
                            th:text="#{project.createOrEdit.button.createYearLeft}">在左边插入年份
                    </button>
                </td>
            </tr>
            <tr>
                <td>
                    <button type="button" class="btn btn-primary btn-sm" onclick="addYearAfter()"
                            th:text="#{project.createOrEdit.button.createYearRight}">在右边插入年份
                    </button>
                </td>
            </tr>
            <tr>
                <td>
                    <button type="button" class="btn btn-primary btn-sm" onclick="removeYear()"
                            th:text="#{project.createOrEdit.button.deleteYear}">删除此列
                    </button>
                </td>
            </tr>
        </table>
    </div>
    <!--弹出添加行-->
    <div id="regionRowDialog" style="display: none;padding-top: 0px;">
        <div id="regionTreeView" style="width:370px;height:220px;overflow:auto;padding-top: 0px;"
             class="demo-section k-content"></div>
    </div>
    <!--错误提示-->
    <div id="errorMessageDialog">
    </div>
    <!--弹出添加年份-->
    <div id="dialogYear" style="padding-top: 0px;">
        <div id="treeViewYear" style="width:370px;height:220px;overflow:auto;padding-top: 0px;"></div>
    </div>
    <!--弹出添加指标（列）-->
    <div id="dialogTarget" style="padding-top: 0px;min-height: 400px;">
        <div class="row" style="padding-top: 10px;">
            <div class="col-md-5">
                <div class="box box-info">
                    <div class="box-header with-border">
                        <span class="box-title" th:text="#{project.createOrEdit.text.selectDecade}">选择年份</span>

                        <div class="box-tools pull-right">
                            <button type="button" class="btn btn-box-tool" data-widget="collapse"><i
                                    class="fa fa-minus"></i>
                            </button>
                        </div>
                    </div>
                    <div class="box-body">
                        <div class="table-responsive">
                            <!--添加年份-->
                            <div>
                                <select id="optionalYear" multiple="multiple"
                                        style="width: 80%;">
                                    <option>1980</option>
                                    <option>1981</option>
                                    <option>1982</option>
                                    <option>1983</option>
                                    <option>1984</option>
                                    <option>1985</option>
                                    <option>1986</option>
                                    <option>1987</option>
                                    <option>1988</option>
                                    <option>1989</option>
                                    <option>1990</option>
                                    <option>1991</option>
                                    <option>1992</option>
                                    <option>1993</option>
                                    <option>1994</option>
                                    <option>1995</option>
                                    <option>1996</option>
                                    <option>1997</option>
                                    <option>1998</option>
                                    <option>1999</option>
                                    <option>2000</option>
                                    <option>2001</option>
                                    <option>2002</option>
                                    <option>2003</option>
                                    <option>2004</option>
                                    <option>2005</option>
                                    <option>2006</option>
                                    <option>2007</option>
                                    <option>2008</option>
                                    <option>2009</option>
                                    <option>2010</option>
                                    <option>2011</option>
                                    <option>2012</option>
                                    <option>2013</option>
                                    <option>2014</option>
                                    <option>2015</option>
                                    <option>2016</option>
                                    <option>2017</option>
                                </select>
                                <!--<button class="k-button" id="get">确定</button>-->
                                <!--<button class="k-button" id="get1">确定1</button>-->
                            </div>
                        </div>
                        <!-- /.table-responsive -->
                    </div>
                    <!-- /.box-body -->
                </div>
            </div>
            <div class="col-md-6">
                <div class="box box-info">
                    <div class="box-header with-border">
                        <span class="box-title" th:text="#{project.createOrEdit.text.selectRegion}">选择行政区划</span>

                        <div class="box-tools pull-right">
                            <button type="button" class="btn btn-box-tool" data-widget="collapse"><i
                                    class="fa fa-minus"></i>
                            </button>
                        </div>
                    </div>
                    <div class="box-body">
                        <div class="table-responsive">
                            <!--选择行政区划-->
                            <div>
                                <input id="administrativeDivision" style="width: 100%;"/>
                            </div>
                        </div>
                        <!-- /.table-responsive -->
                    </div>
                    <!-- /.box-body -->
                </div>
            </div>
        </div>
        <div class="row" style="padding-top: 0px;">
            <div class="col-md-5">
                <div class="box box-info">
                    <div class="box-header with-border">
                        <span class="box-title" th:text="#{project.createOrEdit.text.existIndicators}">已存在指标</span>

                        <div class="box-tools pull-right">
                            <button type="button" class="btn btn-box-tool" data-widget="collapse"><i
                                    class="fa fa-minus"></i>
                            </button>
                        </div>
                    </div>
                    <div class="box-body">
                        <div class="table-responsive">
                            <!--已存在指标-->
                            <div>
                                <div id="treeview-left" style="width:250px;height:236px;overflow:auto;"></div>
                            </div>
                        </div>
                        <!-- /.table-responsive -->
                    </div>
                    <!-- /.box-body -->
                </div>
            </div>
            <div class="col-md-6">
                <div class="box box-info">
                    <div class="box-header with-border">
                        <span class="box-title" th:text="#{project.createOrEdit.text.alternativeIndicators}">备选指标</span>

                        <div class="box-tools pull-right">
                            <button type="button" class="btn btn-box-tool" data-widget="collapse"><i
                                    class="fa fa-minus"></i>
                            </button>
                        </div>
                    </div>
                    <div class="box-body">
                        <div class="table-responsive">
                            <div>
                                <!--备选指标-->
                                <input id="stateStatistics" name="animation" type="radio" checked="checked"/>
                                <label th:text="#{project.createOrEdit.text.nationalIndicators}">国家统计局</label>
                                <input id="placeStatistics" name="animation" type="radio"/>
                                <label th:text="#{project.createOrEdit.text.localIndicators}">地方统计局</label>
                                <input id="inquireTarget" style="width: 70%;"/>
                                <div id="addTarget"
                                     style="width:100%;height:180px;overflow:auto;"></div>
                            </div>
                        </div>
                    </div>
                    <!-- /.table-responsive -->
                </div>
                <!-- /.box-body -->
            </div>
        </div>
    </div>
    <!--弹出更新数据源菜单-->
    <div id="mouseMenu3" style="display: none; float: left; position: absolute;">
        <table class="table table-bordered table-hover" style=" background-color: ghostwhite;">
            <tr>
                <td>
                    <button type="button" class="btn btn-link btn-xs" onclick="updateData()"
                            th:text="#{project.createOrEdit.button.updateData}">更新数据源
                    </button>
                </td>
            </tr>
        </table>
    </div>
    <!--弹出更新数据窗口-->
    <div id="dialogUpdateData" style="padding-top: 0px;">
        <div class="row" style="padding-top: 10px;">
            <div class="col-md-6">
                <div class="box box-info">
                    <div class="box-header with-border">
                        <span class="box-title" th:text="#{project.createOrEdit.text.targetNowData}">当前指标数据源</span>
                        <div class="box-tools pull-right">
                            <button type="button" class="btn btn-box-tool" data-widget="collapse"><i
                                    class="fa fa-minus"></i>
                            </button>
                        </div>
                    </div>
                    <div class="box-body">
                        <div class="table-responsive">
                            <div>
                                <table class="table">
                                    <tr>
                                        <td th:text="#{project.createOrEdit.text.textRegion}">行政区划</td>
                                        <td>
                                            <input id="areaText" type="text" value="" class="form-control input-sm"/>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td th:text="#{project.createOrEdit.text.textYear}">统计年份</td>
                                        <td>
                                            <input id="yearText" type="text" value="" class="form-control input-sm"/>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td th:text="#{project.createOrEdit.text.textTarget}">统计指标</td>
                                        <td>
                                            <input id="targetText" type="text" value="" class="form-control input-sm"/>
                                        </td>
                                    </tr>
                                </table>
                            </div>
                        </div>
                        <!-- /.table-responsive -->
                    </div>
                    <!-- /.box-body -->
                </div>
            </div>
            <div class="col-md-5">
                <div class="box box-info">
                    <div class="box-header with-border">
                        <span class="box-title" th:text="#{project.createOrEdit.text.targetReplace}">替换指标</span>

                        <div class="box-tools pull-right">
                            <button type="button" class="btn btn-box-tool" data-widget="collapse"><i
                                    class="fa fa-minus"></i>
                            </button>
                        </div>
                    </div>
                    <div class="box-body">
                        <div class="table-responsive">
                            <div>
                                <input id="stateStatistics_Update" name="animation" type="radio" checked="checked"/>
                                <label th:text="#{project.createOrEdit.text.nationalStatistics}">国家统计局</label>
                                <input id="placeStatistics_Update" name="animation" type="radio"/>
                                <label th:text="#{project.createOrEdit.text.placeStatistics}">地方统计局</label>
                                <input id="inquireTarget_Update" style="width: 70%;"/>
                                <div id="addTarget_Update" style="width:250px;height:180px;overflow:auto;"></div>
                            </div>
                        </div>
                        <!-- /.table-responsive -->
                    </div>
                    <!-- /.box-body -->
                </div>
            </div>
        </div>
    </div>
    <!--弹出保存窗口-->
    <div id="dialogSave" style="display: none;padding-top: 0px;text-align:center;">
        <span style="display:inline;" th:text="#{project.createOrEdit.text.spaceType}">空间化类型</span>
        <input id="dotSpaceType" name="animation" type="radio" checked="checked"/>
        <label th:text="#{project.createOrEdit.text.dotSpaceType}">点</label>
        <input id="surfaceSpaceType" name="animation" type="radio"/>
        <label th:text="#{project.createOrEdit.text.surfaceSpaceType}">面</label>
        <br/>
        <span style="display:inline;" th:text="#{project.createOrEdit.text.administrativeYear}">行政区年份</span>
        <input type="text" th:placeholder="#{project.createOrEdit.text.administrativeYear}">
        <br/>
        <input type="checkbox"><label th:value="#{project.createOrEdit.text.administrativeYear}">需要对数据进行时态展示</label>
    </div>
</div>
</html>
